<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="icon" href="./assets/images/640.webp" type="image/x-icon">
    <title>快快买</title>
    <script src="./utils/flexible.js"></script>
    <script src='https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js'></script>
    <link rel="stylesheet" href="./css/index.css">
</head>
<style>
 
</style>
<!-- //使用rem 来进行适配 -->
<body>
    <!-- header -->
    <header id="header">
        <a href=""><img src="./assets/images/header_logo.png" alt=""></a>
        <a href=""><img src="./assets/images/header_app.png" alt=""></a>
    </header>

    <!-- search -->
    <section id="search">
        <div class="searchbox"><input type="text" name placeholder="请输入你想比价的产品"></div>
        <div class="button"><button>搜索</button></div>
    </section>


    <!-- nav -->
    <nav id="navd">

    </nav>

    <!-- 折扣推荐 -->
    <section id="discount">
        <span>超值折扣推荐</span>
        <a href="">
            <span><img src="./assets/images/more.png" alt=""></span>
        </a>
    </section>

    <!-- 商品 -->
    <section id="product">
        <ul class="info">
           <!-- <li>
            <a href="">
                <div class="left"></div>
                <div class="right"></div>
            </a>
           </li> -->
        </ul>
    </section>

    <!-- 底部 -->
    <section id="footer">
        <a href="">更多优惠信息</a>
    </section>
    <div id="GDyh">
        <span>品牌排行</span>
        <a href=""><img src="./assets/images/more.png" alt=""></a>
    </div>
    <div id="denglu">
        <a href="">登录</a>
        <a href="">注册</a>
        <a href="">返回顶部</a>
    </div>
    <div id="bottomm">
        <p>
            <a href="">手机APP下载</a>
            <a href="">慢慢买手机版</a>
            ---掌上比价平台
        </p>
        <p>m.kuaikuaimai.com</p>
    </div>




</body>

</html>
<script src="js/index.js"></script>
<script>

    // ------------navd-------------
// let nav = null;
if (window.XMLHttpRequest) {
        nav = new XMLHttpRequest()
    } else {
        nav = new ActiveXObject('microsoft.XMLHTTP')
    }
nav.open('get', 'http://chst.vip:1234/api/getindexmenu')
nav.send()
nav.onreadystatechange = function (){
    if (nav.status === 200 && nav.readyState === 4) {
             nav = JSON.parse(nav.responseText)
             console.log(nav);
             let html = "";
             nav.result.forEach(item => {
                //  console.log(item);
                 let img = item.img.replace(/images/,"assets/images")
                //  console.log(img);
                 html += `<div><a href=./page/${item.titlehref}><span>${img}</span></a><p>${item.name}</p></div>`
                 let navd = document.querySelector("#navd")
                 navd.innerHTML = html;  
             });
             document.querySelector("#navd div:nth-of-type(8) a").setAttribute("href","#")
             let gengduo = $("#navd div:nth-of-type(8)")
                // console.log(gengduo);
                let a = true;
                gengduo.click(function(){
               if(a){
                $("#navd").animate({height: "8.27rem"})
                a = false
               }else{
                $("#navd").animate({height: "5.49rem"})
                a = true;
               }
                })
        }
}

// -----------------product------------------------
if (window.XMLHttpRequest) {
        product = new XMLHttpRequest()
    } else {
        product = new ActiveXObject('microsoft.XMLHTTP')
    }
product.open('get', 'http://chst.vip:1234/api/getmoneyctrl')
product.send()
product.onreadystatechange = function (){
    if (product.status === 200 && product.readyState === 4) {
        product = JSON.parse(product.responseText)
        console.log(product);
        let html = "";
        product.result.forEach(item => {
            html+=`<li>
            <a href="./page/indexXiang.html?productid=${item.productId}">
                <div class="left">${item.productImg2}</div>
                <div class="right"><div class="top">${item.productName}<span>${item.productPinkage}</span></div><div><span>${item.productFrom}|${item.productTime}</span><span>${item.productComCount}</span></div></div>
            </a>
           </li>`

                let  productA = document.querySelector("#product .info")
                productA.innerHTML = html
        })
    }
}





</script>